<template>
  <div style="min-width: 300px;width: 100%;">
    <el-form v-if="device.online && device.map !== undefined" label-width="80px" label-position="left">
      <el-row :gutter="5">
        <el-col :span="funcSpan">
          <el-form-item v-if="device.map.PC !== undefined" :label="$t('device.PC')">
            <el-switch :value="device.map.PC === 'ON'" :active-text="$t('On')" :inactive-text="$t('Off')"
              v-on:change="handleChange(device,'PC',2000)"></el-switch>
          </el-form-item>
        </el-col>
        <el-col :span="funcSpan">
          <el-form-item v-if="device.map.AC !== undefined" :label="$t('device.outAC')">
            <el-switch :value="device.map.AC === 'ON'" :active-text="$t('On')" :inactive-text="$t('Off')"
              v-on:change="handleChange(device,'AC',device.map.AC === 'ON' ? 0:1)"></el-switch>
          </el-form-item>
        </el-col>
        <el-col :span="funcSpan">
          <el-form-item v-if="device.map.Curtain !== undefined" :label="$t('device.Cloth')">
            <el-switch :value="device.map.Curtain === 'DOWN'" :active-text="$t('On')" :inactive-text="$t('Off')"
              v-on:change="handleChange(device,'Curtain',device.map.Curtain === 'DOWN'?2:1)" />
          </el-form-item>
        </el-col>
        <el-col :span="funcSpan">
          <el-form-item :label="$t('device.Projector')">
            <el-button type="primary" v-on:click="handleSeatChange(device,1)">{{ $t('On') }}</el-button>
            <el-button type="primary" v-on:click="handleSeatChange(device,0)">{{ $t('Off') }}</el-button>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>
<script>
  import BaseController from './BaseController'
  export default {
    name: 'ControlController',
    mixins: [BaseController],
    data() {
      return {
        funcSpan: 8
      }
    },
    methods: {
      setItemDevice(device) {},
      handleSeatChange(device, key, action) {
        var code = device.code
        var message = {
          "CodeSend": {
            "Port": 0,
            "Seat": key
          }
        }
        this.handleCommand(code, message, action);
      },
      handleChange(device, key, status, action) {
        var code = device.code
        var message = {}
        message[key] = status
        this.handleCommand(code, message, action);
      },
      handleCommand(code, message, action) {
        var command = 'control'
        var content = null;
        if (code.indexOf("PLATFORM_") >= 0) {
          content = JSON.stringify(message)
        } else if (code.indexOf("BleGate_") >= 0) {
          const data = {
            "PackageType": 0,
            "DeviceControl": {
              "DevMac": code.split("@").pop(),
              "Message": message
            }
          }
          content = JSON.stringify(data)
        }
        this.doCommand(code, command, content, action);
      }
    }
  }

</script>
